<!DOCTYPE html>
<style>
  body {
    height: 2000px;
    width: 2000px;
  }
  ::-webkit-scrollbar {
    width: 0px;
    height: 0px;
  }
</style>
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script>
  var browserZoomFactor = 1.25;

  function viewport() {
    return window.visualViewport;
  }

  var numCallsResize = 0;

  async_test(function(t) {
    window.onload = t.step_func(function() {

      window.visualViewport.addEventListener('resize', function(e) {
        numCallsResize++;
      });

      window.scrollTo(100, 100);

      // TODO(ymalik): Remove hook to internals to pinch-zoom here and browser
      // zoom below. This will be required to upstream to w3c repo.
      internals.setPageScaleFactor(2);

      // Offset visual viewport by 10px.
      internals.setVisualViewportOffset(10, 10);

      assert_equals(viewport().offsetTop, 10);
      assert_equals(viewport().offsetLeft, 10);
      assert_equals(viewport().width, 400);
      assert_equals(viewport().height, 300);
      assert_equals(viewport().scale, 2);

      // Apply browser zoom.
      if (window.testRunner)
        testRunner.setPageZoomFactor(browserZoomFactor);

      requestAnimationFrame(function() {
        t.step(function() {
          assert_equals(numCallsResize, 1, "resize listener called for browzer zoom");
          // Visual viewport dimensions should be scaled by the browser zoom factor.
          assert_equals(viewport().offsetTop, 10 / browserZoomFactor);
          assert_equals(viewport().offsetLeft, 10 / browserZoomFactor);
          assert_equals(viewport().width, 400 / browserZoomFactor);
          assert_equals(viewport().height, 300 / browserZoomFactor);
          assert_equals(viewport().scale, 2);

          t.done();
        });
      });
    });
  }, 'Verify viewport dimensions under browser zoom.');
</script>
